<template>
  <div class="btns_box">
    <ga-button type="secondary" :disabled="isdisable"> 开机 </ga-button>
    <ga-button style="margin: 0 8px" type="secondary" :disabled="isdisable">
      关机
    </ga-button>
    <ga-button type="secondary" :disabled="isdisable"> 重启 </ga-button>
    <ga-button style="margin: 0 8px" type="secondary" :disabled="isdisable">
      销毁
    </ga-button>
    <ga-dropdown @select="handleSelect">
      <ga-button type="secondary" :disabled="isdisable" style="margin-right: 8px"
        >调整虚机归属
        <icon-down style="margin-left: 8px" />
      </ga-button>
      <template #content>
        <ga-doption>调整用户</ga-doption>
        <ga-doption>调整项目</ga-doption>
      </template>
    </ga-dropdown>
    <ga-button
      style="margin-right: 8px"
      type="primary"
      @click="$router.push('/computing-mgmt/vm/create')"
    >
      创建云机
    </ga-button>
    <!-- <ga-button type="primary" :loading="true">同步</ga-button> -->
  </div>
</template>

<script setup>
import { ref, computed, defineExpose, toRefs } from "vue";

const props = defineProps({
  selectedKeys: {
    type: Array,
    default: () => [],
  },
});
// const { selectedKeys } = toRefs(props);
const isdisable = computed(() => props.selectedKeys?.length === 0);
const emits = defineEmits(["handleSubmit"]);
defineExpose({});
// const handleTabChange = (tab) => {
//   emits('handleTabChange', tab)
// }
</script>

<style lang="scss" scoped>
.btns_box {
  display: flex;
}
</style>
